Ext.define('CDR.view.TariffConfig', {
	extend: 'Ext.form.Panel',
	alias: 'widget.tariff-config',
	layout: 'anchor',
	bodyPadding: 10,
	border: false,
	defaults: {
		labelWidth: 70
	},
	buttonAlign: 'center',
	buttons: [{
		name: 'save',
		text: 'Save'
	}],
	items: [{
		xtype: 'hidden',
		name: 'id'
	},{
		xtype: 'textfield',
		fieldLabel: 'Name',
		name: 'name',
		allowBlank: false,
		anchor: '100%'
	}, {
		xtype: 'textarea',
		fieldLabel: 'Description',
		name: 'description',
		anchor: '100%'
	}, {
		xtype: 'fieldcontainer',
		fieldLabel: 'Holiday Day of week',
		labelAlign: 'top',
		layout: 'hbox',
		items:[{
			xtype: 'checkbox',
			boxLabel: 'Mon',
			name: 'dayOfWeek',
			inputValue:'Mon',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Tue',
			name: 'dayOfWeek',
			inputValue:'Tue',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Wed',
			name: 'dayOfWeek',
			inputValue:'Wed',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Thu',
			name: 'dayOfWeek',
			inputValue:'Thu',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Fri',
			name: 'dayOfWeek',
			inputValue:'Fri',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Sat',
			name: 'dayOfWeek',
			inputValue:'Sat',
			flex: 1
		},{
			xtype: 'checkbox',
			boxLabel: 'Sun',
			name: 'dayOfWeek',
			inputValue:'Sun',
			flex: 1
		}]
	}, {
		xtype: 'fieldcontainer',
		fieldLabel: 'National holidays',
		labelAlign: 'top',
		layout: 'fit',
		items: [{
			xtype: 'gridpanel',
			autoScroll: true,
			height: 300,
			store: Ext.create('Ext.data.Store', {
				fields:[{name: 'id', type: 'int'},'date','dateType', 'description']
			}),
			tbar: [{
				text: 'Add new',
				name: 'add-date',
				iconCls: 'icon-add'
			}],
			columns: [{
				text: 'Date',  
				dataIndex:'date', 
				xtype:'datecolumn', 
				menuDisabled: true,
				editor: {
					xtype: 'datefield',
	                format: 'd/m',
				},
				format:'d/m'
			}, {
				text: 'Date type',  
				dataIndex:'dateType', 
				editor: {
					xtype: 'combo',
					store: Ext.create('Ext.data.Store', {
						fields:[{name: 'value'},'text'],
						data: [{value: 'DL', text: 'Duong Lich'}, {value: 'AL', text: 'Am Lich'}]
					}),
					queryMode: 'local',
					valueField: 'value',
					displayField: 'text'
				},
				sortable: false,
				menuDisabled: true,
				flex: 1
			}, {
				text: 'Description',  
				dataIndex:'description', 
				editor: 'textfield',
				sortable: false,
				menuDisabled: true,
				flex: 1
			},{
				header: 'Delete',  
				xtype: 'actioncolumn',
				sortable: false,
				menuDisabled: true,
				align: 'center',
				width: 50,
				items:[{
                    icon:'resources/app/images/delete.png',
                    handler: function(grid, rowIndex, colIndex) {
                        grid.store.removeAt(rowIndex);
                    }
                }]
			}],
			plugins: [Ext.create('Ext.grid.plugin.CellEditing', {
			        clicksToEdit: 2,
			        listeners: {
			        	edit: function(editor, e){
			        	
			        	}
			        }
		    })]
		}]
	}, {
		xtype : 'textfield',
		name: 'holidayDiscountValue',
		allowBlank: false,
		fieldLabel: 'Holiday Discount Percent',
		labelWidth: 150,
		anchor: '35%'
	}],
	
	populdateValue: function(valueObject){
		var me = this;
		if(this.rendered) {
			var fields = this.query('field');
			Ext.iterate(fields, function(field){
				if(valueObject[field.name] != null){
					field.setValue(valueObject[field.name]);
				}
			});
			var gridData = valueObject['discountRates'];
			if(gridData){
				 var grid = this.query('gridpanel')[0];
				 var store = grid.store;
				 store.removeAll(false);
				 Ext.iterate(gridData, function(r){
				 	if(r.type == 'DATE') {
				 		store.add({
						 	id: r.id,
						 	date: Ext.Date.parse(r.condition, 'd/m/Y'),
						 	dateType: r.dateType,
						 	description: r.description 
						 });	
				 	} else {
				 		var dayOfWeek = me.query('checkbox[inputValue='+ r.condition+']')[0];
				 		if(dayOfWeek){
				 			dayOfWeek.setValue(r.condition);
				 		}
				 	}
				 });
			}
		}
	},
	
	buildExtraData: function() {
		//build grid data
		var me = this;
		var data = [];
		var store = me.down('gridpanel').store;
		store.each(function(item){
			data.push({
				id: item.data.id,
				date: Ext.Date.format(item.data.date, 'd/m/Y'),
				dateType: item.data.dateType,
				description: item.data.description
			});
		});
		return {holidays:Ext.encode(data)};
	}
});	